<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>文档标题</title>
    <style>
        #box {
            margin: 100px auto;
        }
    </style>
</head>
<body>
<div id="box">
    <input type="text" id="first">
    <select id="operator">
        <option style="display: none;">请选择</option>
        <option value="plus">+</option>
        <option value="minus">-</option>
        <option value="multi">*</option>
        <option value="divide">/</option>
    </select>
    <input type="text" id="second">
    <button id="calculate">=</button>
    <input type="text" id="result">
</div>

<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
<script>
  $(document).ready(function () {
    $("#calculate").click(function () {
      const first = Number($("#first").val());
      const second = Number($("#second").val());
      let result;
      switch ($("#operator").val()) {
        case "plus":
          result = first + second;
          break;
        case "minus":
          result = first - second;
          break;
        case "multi":
          result = first * second;
          break;
        case "divide":
          result = first / second;
          break;
      }
      $("#result").val(result);
    });
  })
</script>
</body>
</html>
